body,
a{
    color:#222;
}
a,
.nav-classify-name{
    cursor: pointer;
}
.bar-icon-mobile,
.bar-icon-wechat,
.bar-icon-service,
.bar-icon-gzs,
.bar-card-name,
.bar-item-name:after,
.search-button,
.hp-icon-hw,
.hp-icon-gc,
.hp-icon-yc,
.hp-icon-gn,
.nav-classify-name:after,
.nav-icon-article,
.nav-icon-market
{   
    /*position: relative;*/
    display: inline-block;
    vertical-align: middle;
    background-image: url(../images/sprite_icons.png);     /*背景图片出不来*/
    background-repeat: no-repeat;
}
.bar-icon-mobile{
    width:9px;height:15px;
    background-position:0 -250px;
}
.bar-icon-wechat{
    width:18px;height:14px;
    background-position: -65px 0;
}
.bar-icon-service{
    width:13px;height:14px;
    background-position: -35px 0;
}
.bar-icon-gzs{
    width:14px;height:14px;
    background-position: -767px 0;
}

.bar-item-name:after{
    content:"";
    position:absolute;
    right:0px;
    top:17px;
    width:9px;height:6px;
    background-position: -72px -50px;
}
.bar-item-name-none:after{
    background:none;
}
//这里是网页大模块宽度公用样式
.bar-wrap,
.hd-wrap,
.nav-inner{
    width:1210px;
    margin:0 auto;
}
//
.bar-outer{
    width:100%;height:40px;
    background:#505050;
    border-bottom:4px solid #4ed6d1;
}
.bar-wrap{
    height:100%;
}
.bar-left{
    float:left;
    height:100%;
    line-height:40px;
}
.bar-item{
    position:relative;
    float:left;
    margin-right:20px;
    //height:100%;
}
.bar-item>a,
.bar-user>a{
    font-size:12px;
    color:#c5c5c5;  /*下拉列表里面的颜色用class样式覆盖了吧*/
}
.bar-user>a{
    margin-right:20px;
}
.bar-item-name{   /*这个是给span标签写的样式*/
    display:block;
    position:relative;
    padding-right:20px;
    font-size:12px;
    color:#c5c5c5;
}   

.bar-right{
    float:right;
    height:100%;
    line-height:40px;
}
.bar-user,
.bar-card{
    float:left;
    height:100%;
}

.bar-user .line{
    margin-right:20px;
    color:#777;
}
.bar-card{
    margin-left:10px;
}
.bar-card .bar-card-name{
    display:inline-block;
    margin:0 5px;
    width:23px;height:19px;
    text-indent:-9999px;           /* 看看写这三个字有什么用*/
    background-position: -136px 0;
}
.bar-card .bar-card-num{
    position:relative;
    display:inline-block;
    vertical-align: middle;
    width:38px;height:20px;
    border-radius: 4px;
    font-size:12px;
    text-align:center;
    line-height:20px;
    color:#fff;
    background-color:#5FD9DA
}
.bar-card-num:before{
    display:block;
    width:10px;height:10px;
    border:5px solid transparent;
    border-right-color:#5fd9da;
    position:absolute;
    /*left:-9px;*/top:50%;
    /*margin-top:-5px;*/
}

.bar-item-cont{
    position:absolute;
    top:44px;
    left:0;
    margin-top:10px;
    padding:15px;
    min-width:50px;
    border:1px solid #ddd;
    font-size:12px;
    text-align: center;
    background:#fff;
    img{
        display:block;
        margin-bottom:10px;
    }
}
.bar-item-cont>a{
    line-height: 25px;
}

//head-wrap
.hd-wrap{
    padding-top:35px;
    .hd-logo{
        float:left;
        width:188px;height: 75px;
    };
    .hd-search{
        float:left;
        position:relative;
        width:431px;height: 34px;
        border:2px solid #4ed6d1;
        margin-left:64px;
        margin-top:20px;
        .search-key{
            width:376px;height: 34px;
            padding:0 10px;
            line-height: 34px;
            margin-right:37px;
            border:0;
            color:#666;   //这个颜色
            cursor: auto;
        }
       .search-button{
           position:absolute;
           right:-2px;top:-2px;
           width:38px;height: 38px;
           border:0;
           background-color:#4ed6d1;
           background-position: -276px 11px;
       } 
    }
    .hd-valuable{
        float:right;
        margin-top:25px;
        a{
            float:left;
            height:30px;
            margin-left:30px;
            font-size:14px;
            line-height:30px;
            color:#777;
            em{
                margin-right: 10px;
            }
            .hp-icon-hw{
                width:28px;height: 28px;
                background-position: 0 -98px;
            }
            .hp-icon-gc{
                width:25px;height: 22px;
                background-position: -40px -99px;
            }
            .hp-icon-yc{
                width:30px;height: 30px;
                background-position: -80px -96px;
            }
            .hp-icon-gn{
                width:41px;height: 24px;
                background-position: -120px -99px;
            }
        }
        a:first-child{
            margin-left:0;
        }
        
    }
}
//nav-wrap
.nav-wrap{
    padding-top:40px;
    border-bottom:1px solid #c7c7c7;
    .nav-inner{
        height:60px;
        .nav-classify{
            position:relative;
            //z-index: 9;
            float:left;
            //width:168px;height: 60px;
            //overflow:visible;
            .nav-classify-name{
                position:relative;
                display: block;
                width:136px;height: 60px;
                font-size:16px;
                line-height: 60px;
                padding-left:32px;//网站是text-indent:32px;记住这个用法
                letter-spacing:2px;
                color:#fff;
                background-color:#92a9b9;
            }
            .nav-classify-name:after{
                content:"";
                position:absolute;
                right:33px;top:24px;
                width:14px;height: 11px;
                background-position:-74px -300px;
            }
        }
        .nav-country{
            float:left;
            //overflow:hidden;
            width:880px;height: 56px;
            margin-left:20px;
            ul{
                margin-left:20px;
                .item{
                    float:left;
                    min-width: 48px;
                    margin-right:43px;
                    margin-bottom:6px;
                    font-size:14px;
                    line-height: 22px;
                    letter-spacing: 1px;
                    text-align: left;
                }
                .country-long{
                    width:68px;
                }
            }
        }
        .nav-side-item{
            height:24px;
            font-size:14px;
            line-height: 24px;
            margin-top:8px;
            .nav-icon-article,
            .nav-icon-market{
                float:left;
                width:26px;height: 24px;
                margin-right:8px;
            }
            .nav-icon-article{
                background-position: -762px -250px;
                //position:relative;
                //left:2px;
                //display:inline-block;
                //vertical-align:middle;
            }
            .nav-icon-market{
                background-position: -762px -200px;      
            }
        }
    }
}

